import React, { Suspense } from "react";
import { BrowserRouter, useRoutes } from "react-router-dom";
import MainLayout from "../layout/mainLayout";
// 路由懒加载
const Home = React.lazy(() => import("../views/home"));
const ListAdd = React.lazy(() => import("../views/listAdd"));
const ListManage = React.lazy(() => import("../views/listManage"));
const Set = React.lazy(() => import("../views/set"));
export const menu_router = [
  {
    path: "/",
    title: "首页",
    element: <Home></Home>,
  },
  {
    path: "/list/add",
    title: "列表添加",
    element: <ListAdd></ListAdd>,
  },
  {
    path: "/list/manage",
    title: "列表管理",
    element: <ListManage></ListManage>,
  },
  {
    path: "/set",
    title: "设置",
    element: <Set></Set>,
  },
]
export const routes = [
  {
    path: "/",
    element: <MainLayout></MainLayout>,
    children: menu_router,
  },
];

const Router = () => {
  const RouterView = () => useRoutes(routes);
  return (
    <Suspense>
      <BrowserRouter>
        <RouterView></RouterView>
      </BrowserRouter>
    </Suspense>
  );
};

export default Router;
